<html>
    <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
        <title>Google Maps JavaScript API v3 Example: Event Simple</title>
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">
            var map;
            function initialize() {
                var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
                var myOptions = {
                    zoom: 4,
                    center: myLatlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                }
                map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

                //zoom_changed event 用法
                google.maps.event.addListener(map, 'zoom_changed', function() {
                    //setTimeout(code,millisec)
                    //code	必需。要调用的函数后要执行的 JavaScript 代码串。
                    //millisec	必需。在执行代码前需等待的毫秒数。
                    setTimeout(moveToDarwin, 1500);
                });

                var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map,
                    title:"Hello World!"
                });
                //click event 用法
                google.maps.event.addListener(marker, 'click', function() {
                    map.setZoom(8);
                });
            }

            function moveToDarwin() {
                var darwin = new google.maps.LatLng(-12.461334, 130.841904);
                map.setCenter(darwin);
            }

        </script>
    </head>
    <body style="margin:0px; padding:0px;" onload="initialize()">
        <div id="map_canvas" style="width:100%; height:100%"></div>
    </body>
</html>
